


<template>
  <div class="model-form">
    <el-page-header @back="goBack" content="增加打印机">
    </el-page-header>
    <div class="model-content">
      <el-form ref="ruleForm" :rules="rules" :model="form" label-width="160px">
        <el-row :gutter="10">
 <el-col :span="22">
     <el-form-item label="商家名称" size="mini" prop="shop">
             <el-select style="width: 100%;"  v-model="form.shop" filterable clearable
             remote   :remote-method="remoteShop"
                     placeholder="请选择">
                 <el-option v-for="item in shopOptions" :key="item.id"
                         :label="item.name" :value="item.id">
                 </el-option>
             </el-select>
     </el-form-item>
      
 </el-col>
 <el-col :span="22">
     <el-form-item label="打印机名称" size="mini" prop="name">
             <el-input v-model="form.name" name="name">
             </el-input>
     </el-form-item>
      
 </el-col>
 <el-col :span="22">
     <el-form-item label="打印机类型" size="mini" prop="deviceType">
             <el-select style="width: 100%;"  v-model="form.deviceType" filterable clearable
                     placeholder="请选择">
                 <el-option v-for="item in deviceTypeOptions" :key="item.id"
                         :label="item.name" :value="item.id">
                 </el-option>
             </el-select>
     </el-form-item>
      
 </el-col>
 <el-col :span="22">
     <el-form-item label="底部机械码" size="mini" prop="deviceCode">
             <el-input v-model="form.deviceCode" name="deviceCode">
             </el-input>
     </el-form-item>
      
 </el-col>
 <el-col :span="22">
     <el-form-item label="底部机械密钥" size="mini" prop="secretKey">
             <el-input v-model="form.secretKey" name="secretKey">
             </el-input>
     </el-form-item>
      
 </el-col>
 <el-col :span="22">
     <el-form-item label="终端模式" size="mini" prop="model">
             <el-select style="width: 100%;"  v-model="form.model" filterable clearable
                     placeholder="请选择">
                 <el-option v-for="item in modelOptions" :key="item.id"
                         :label="item.name" :value="item.id">
                 </el-option>
             </el-select>
     </el-form-item>
      
 </el-col>
        </el-row>
        <el-row>
          <el-col :span="24" style="text-align: right;padding-bottom: 20px;padding-top: 20px;">
            <el-button @click="goBack">取消</el-button>
            <el-button type="primary" @click="add">确定</el-button>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </div>
</template>

<script>
  import common from "@/mixins/common.js";
  var config = {};
  config.methods = {};
  config.mixins = [common];


	config.data = function () {
			return {
				form: {
					shop: '',
					name: '',
					deviceType: '',
					deviceCode: '',
					secretKey: '',
					model: ''				},
            shopOptions: [],
            deviceTypeOptions: [],
            modelOptions: [],
				rules: {
                        shop: [
							          { required: true, message: '请输入商家名称', trigger: 'blur' }
						      ],
                        name: [
							          { required: true, message: '请输入打印机名称', trigger: 'blur' }
						      ],
                        deviceType: [
							          { required: true, message: '请输入打印机类型', trigger: 'blur' }
						      ],
                        deviceCode: [
							          { required: true, message: '请输入底部机械码', trigger: 'blur' }
						      ],
                        model: [
							          { required: true, message: '请输入终端模式', trigger: 'blur' }
						      ]				}
			}
	};

                  config.methods.remoteShop = function (query) {
                      if (query !== '') { }
                      var self = this;
                      var param = {};
                      param.sortMethod = "asc";
                      param.sortField = "id";
                      param.level = 1;
                      param.size = 500;
                      param.fetch = 0;
                      param.name = query;
                      this.postData("/tenantRest/shop/list.htm", param, function (result) {
                          if (result.code == 0) {
                             self.shopOptions= result.list;
                          }
                      });
                  }



  config.methods.add = function () {
			var self = this;
			this.$refs["ruleForm"].validate(function(valid){
				if (valid) {
					self.addData();
				} else {
					console.log('error submit!!');
					return false;
				}
			});
		}

	config.methods.addData = function () {
			var self = this, data = this.form;
			if (this.deforeAddData) {
				this.deforeAddData();
			}
			this.postData("/tenantRest/device/create.htm", data, function (res) {
				if (res.code == 0) {
					self.$message({
						message: '添加数据成功',
						type: 'success'
					});
					self.$router.go(-1);
				} else {
					self.$message.error(res.msg);
				}
			});
		}


		config.methods.loadShopOptions= function(){
				var self=this;
				var param = {};
				param.sortMethod = "asc";
				param.sortField = "id";
				param.level =1;
				param.size =500;
				param.fetch=0;
				this.postData("/tenantRest/shop/list.htm", param, function (result) {
					if (result.code == 0) {
              self.shopOptions= result.list;
					}
				});
		}

		config.methods.loadDeviceTypeOptions= function(){
				var self=this;
				var param = {};
				param.sortMethod = "asc";
				param.sortField = "id";
				param.level =1;
				param.size =500;
				param.fetch=0;
				this.postData("/tenantRest/devicetype/list.htm", param, function (result) {
					if (result.code == 0) {
              self.deviceTypeOptions= result.list;
					}
				});
		}

		config.methods.loadModelOptions= function(){
				var self=this;
				var param = {};
				param.sortMethod = "asc";
				param.sortField = "id";
				param.level =1;
				param.size =500;
				param.fetch=0;
				this.postData("/tenantRest/model/list.htm", param, function (result) {
					if (result.code == 0) {
              self.modelOptions= result.list;
					}
				});
		}

  
  	config.mounted = function () {
         this.loadShopOptions();
         this.loadDeviceTypeOptions();
         this.loadModelOptions();
		}


  export default config;
</script>

<style scoped>
</style>